<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        @media only screen and (max-width: 760px) {
            html {
                font-size: 38px;
            }
            #home {
                width: 100%;
                margin: 0 auto;
            }
            .kissbgpng,
            .kisslolpng {
                display: none;
            }
            #navList {
                padding: 0;
                justify-content: space-around;
            }
            #navList li a {
                text-align: center;
            }
        }

        .kissdashang {
            width: 250px;
            height: 360px;
            position: fixed;
            z-index: 200;
            right: 0;
            top: 100px;
            display: flex;
            margin-right: -220px;
            border-top-right-radius: 0px;
            border-bottom-right-radius: 0px;
            font-size: 16px;
            font-family: '幼圆';
            transition: all 0.3s ease-in;
        }
        .kissdashang:hover {
            margin-right: 0px;
            transition: all 0.3s ease-in;
        }
        .kissdashang .left {

            text-align: center;
            padding-top: 0px;
            box-sizing: border-box;
            font-size: 25px;
            margin-right: 40px;
            color:white;
        }
        .kissdashang .right {
            width: 150px;
        }
        .kissdashang .right p {
            width: 150px;
            font-size: 12px;
            text-align: center;
            line-height: 12px;
            margin-top: 10px;
            margin-bottom: 10px;
            color:white;
        }
        #navList {
            background: #fff;
        }
        #navList > li > a {
            color: black;
        }
    </style>
</head>
<body>
<div class="kissdashang">
    <div class="left">打<br>赏<br>作<br>者</div>
    <div class="right">
        <img src="https://files-cdn.cnblogs.com/files/yummylucky/zhifu.bmp" alt="https://files-cdn.cnblogs.com/files/yummylucky/zhifu.bmp" title="https://files-cdn.cnblogs.com/files/yummylucky/zhifu.bmp" class="right">
        <p>支付宝</p>
        <img src="https://files-cdn.cnblogs.com/files/yummylucky/WeChat.bmp" alt="https://files-cdn.cnblogs.com/files/yummylucky/WeChat.bmp" title="https://files-cdn.cnblogs.com/files/yummylucky/WeChat.bmp" class="right">
        <p>微&nbsp;信</p>
    </div>
</div>
</body>
</html>